<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>

    </style>
    <script src="./js/jquery1.11.3.js"></script>
</head>
<!-- 
    .css('background-color')  .css('backgroundColor') 都可以识别 但是默认获取第一个样式
    css获取的最终显示样式（包括行内样式和内部样式）
    但是css（属性，属性值）设置的是行内样式
    传入回调函数 这里包含了获取旧值和设置新值
 

 -->

<body>
    <p style="background-color:#ff0000">这是一个段落。</p>
    <p style="background-color:#00ff00">这是一个段落。</p>
    <p style="background-color:#0000ff">这是一个段落。</p>
    <script>
        $(function () {
            console.log($('p').css('background-color'))
            // 所有p标签全部设置 调用内部each
            $('p').css('background-color', 'red')
            // 设置多个属性传入obj 
            $('p').css({ 'background-color': 'red', fontSize: 20 })

            // 传入回调函数 这里包含了获取旧值和设置新值
            $('div').css('width', (index, oldval) => parseFloat(oldval) * 1.2)
            $('div').css('height', (index, oldval) => parseFloat(oldval) * 1.2)

        })

    </script>
</body>

</html>